<template>
  <div class="boxqiuhun">
    <van-nav-bar
      right-text="我的情书"
      left-arrow
      @click-left="onClickLeft"
      :border="false"
    />

    <div class="boxqiuhun-content">
      <h1>求婚对象</h1>
      <div class="boxqiuhun-content-center"></div>
      <p>暂无数据</p>
      <div class="boxqiuhun-content-down">独身主义，去挑选尾戒</div>
    </div>
  </div>
</template>

<script>
export default {
  methods: {
    onClickLeft() {
      this.$router.go(-1);
    },
  },
};
</script>

<style lang='scss'>
.boxqiuhun {
  .van-nav-bar {
    line-height: 2.375rem;
    background-color: #1a1a1a;
    border: none;
  }
  .van-nav-bar__title {
    color: white;
    font-size: 32px;
  }
  .van-icon-arrow-left:before {
    color: white;
    font-size: 32px;
  }
  .van-nav-bar__text {
    font-size: 24px;
    color: white;
  }
  .van-nav-bar__content {
    margin-top: 20px;
  }
  .boxqiuhun-content {
    width: 720px;
    height: 1280px;
    background-color: #ffffff;
    margin: 30px auto;
    border-radius: 28px;
    position: relative;
    padding-top: 380px;
  }
  .boxqiuhun-content h1 {
    font-size: 32px;
    display: block;
    width: 308px;
    height: 104px;
    background-color: #bebebe;
    text-align: center;
    line-height: 120px;
    position: absolute;
    top: -47px;
    left: 206px;
    color: white;
  }
  .boxqiuhun-content-center {
    width: 400px;
    height: 264px;
    background-color: #efefef;
    margin: 0 auto;
  }
  .boxqiuhun-content p {
    font-size: 28px;
    margin: 40px auto;
    text-align: center;
    color: black;
  }
  .boxqiuhun-content-down {
    font-size: 28px;
    color: #1a1a1a;
    position: absolute;
    bottom: 0px;
    width: 720px;
    height: 114px;
    background-color: #efefef;
    text-align: center;
    line-height: 114px;
    border-bottom-right-radius: 28px;
    border-bottom-left-radius: 28px;
  }
}
</style>